<template>
   <div id="cesiumContainer" ref="cesiumContainer"></div>
</template>

<script>
import * as Cesium from "cesium";
import "./Widgets/widgets.css";
import { defineComponent,onMounted} from 'vue';
// 设置cesium静态资源路径

Cesium.Ion.defaultAccessToken ="eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJqdGkiOiI2YjZkYzg4Zi1lZDk0LTQ5MzAtOWY2ZC1iZTk2M2ZkMDNkNzMiLCJpZCI6MTcxOTQxLCJpYXQiOjE2OTczNzMxMjF9.XTLkB6y-WYULbHv7dSw__dU6Ku8Q_-6lRUuf6YZMMR0";
// 设置cesium默认视角
Cesium.Camera.DEFAULT_VIEW_RECTANGLE = Cesium.Rectangle.fromDegrees(
  // 西边的经度
  89.5,
  // 南边维度
  20.4,
  // 东边经度
  110.4,
  // 北边维度
  61.2
);
window.CESIUM_BASE_URL = "/";
export default defineComponent({
  name: 'App',
  components: {
    
  },
  setup(){
    onMounted(()=>{
      // cesium viewer查看器
     const viewer = new Cesium.Viewer('cesiumContainer', {
            // 是否显示信息窗口
            infoBox: false,
          })

      //1.经纬度转笛卡尔坐标
      const cartesian3 = Cesium.Cartesian3.fromDegrees(
        // 经度
        89.5,
        // 维度
        20.4,
        // 高度
        100
      )
      console.log(cartesian3);
      // 2.将笛卡尔坐标转为经纬度
      var cartographic = Cesium.Cartographic.fromCartesian(cartesian3);
      console.log(cartographic);
     //3.弧度转角度
      const longitude = Cesium.Math.toDegrees(cartographic.longitude);//经度
      const latitude = Cesium.Math.toDegrees(cartographic.latitude);//维度
      console.log(latitude,longitude);

      // 隐藏左下角的logo
      viewer.cesiumWidget.creditContainer.style.display = "none";   
      });


  }
})
</script>

<style>
* {
  margin: 0;
  padding: 0;
}
#cesiumContainer {
  width: 100vw;
  height: 100vh;
}
</style>
